<template>
	<view class="page">
		<view class="group_2">
			<view class="" style="width: 100%;height: 1rpx;background-color: #dedede;"></view>
			<scroll-view class="group_3" scroll-y="true">
				<!-- <scroll-view></scroll-view> -->


				<view class="" v-for="(item,index) in cardlist" :key="index">
					<view class="" v-if="item.align == 'hor'">
						<text lines="1" class="text_8">{{item.title}}</text>
						<view class="item" v-if="item.type == 'text'">
							{{item.value}}
						</view>
						<view class="item" v-if="item.type == 'img'">
							<image :src="item.value" class="label_4"></image>
						</view>
					</view>
					<view class="" v-if="item.align == 'ver'">
						<text lines="1" class="text_8">{{item.title}}</text>
						<view class="item" v-if="item.type == 'text'">
							<u-parse :content="item.value"></u-parse>
						</view>
					</view>
				</view>

				<!-- <view class="section_12">
					<view class="box_3" style="display: flex;flex-direction: column; ">
						<view class="text-group_1">充值次数</view>
						<view class="text-group_2">3</view>
					</view>
					<view class="image-text_1" style="display: flex;flex-direction: column; ">
						<view class="text-group_1">赠送次数</view>
						<view class="text-group_2">4</view>
					</view>
				</view> -->


				<!-- <text lines="1" class="text_8">票分类</text>
				<view class="item">
					分类1
				</view>


				<text lines="1" class="text_2">选择会员</text>
				<view class="section_12">
					<view class="box_3" style="display: flex;flex-direction: column; ">
						<view class="text-group_1">充值次数</view>
						<view class="text-group_2">3</view>
					</view>
					<view class="image-text_1" style="display: flex;flex-direction: column; ">
						<view class="text-group_1">赠送次数</view>
						<view class="text-group_2">4</view>
					</view>
				</view>

				<text lines="1" class="text_8">选择项目</text>
				<view class="item">
					游泳
				</view>

				<view
					style="display: flex;flex-direction: row; justify-content: space-between;margin-left: 20rpx;width: 40vw;margin-top: 20rpx; ">
					<view>
						启用有效期
					</view>
					<view>
						<u-switch v-model="values1" disabled></u-switch>
					</view>
				</view>

				<view
					style="display: flex;flex-direction: row; justify-content: space-between;margin-left: 20rpx;width: 40vw;margin-top: 20rpx; ">
					<view>
						启用有效天数
					</view>
					<view>
						<u-switch v-model="values2" disabled></u-switch>
					</view>
				</view>

				<text lines="1" class="text_8">指定有效期</text>
				<view class="item">
					2000-20-20
				</view>

				<view
					style="display: flex;flex-direction: row; justify-content: space-between;margin-left: 20rpx;width: 40vw;margin-top: 20rpx; ">
					<view>
						启用库存
					</view>
					<view>
						<u-switch v-model="values3" disabled></u-switch>
					</view>
				</view>

				<view
					style="display: flex;flex-direction: row; justify-content: space-between;margin-left: 20rpx;width: 40vw;margin-top: 20rpx; ">
					<view>
						启用手环
					</view>
					<view>
						<u-switch v-model="values4" disabled></u-switch>
					</view>
				</view>

				<text lines="1" class="text_8">用户最多持有数量</text>
				<view class="item">
					2
				</view>

				<text lines="1" class="text_8">用户限购数量</text>
				<view class="item">
					20
				</view>

				<text lines="1" class="text_8">销售价格</text>
				<view class="item">
					¥88
				</view>

				<text lines="1" class="text_8">详情</text>
				<view class="item">
					sddddddd
				</view> -->
			</scroll-view>
			<view
				style="position: fixed;width: 100%;height: 16vw;background-color: #fff;z-index: 999;bottom: 0;display: flex;flex-direction: row; justify-content: space-between;"
				v-if="list.currentTab == 0 && list.over == 0">
				<!-- 	<button class="button_3" @click="onClick">
					驳回
				</button>
				<button class="button_4" @click="onClick">
					上架
				</button> -->
				<button class="button_5" @click="shangjia">
					上架
				</button>
			</view>
			<view
				style="position: fixed;width: 100%;height: 16vw;background-color: #fff;z-index: 999;bottom: 0;display: flex;flex-direction: row; justify-content: space-between;"
				v-if="list.currentTab == 1">
				<button class="button_5" @click="xiajia">
					下架
				</button>
			</view>
		</view>
	</view>
</template>

<script>
	const personal = require("@/api/personal/index.js");
	export default {
		data() {
			return {
				values1: true,
				values2: false,
				values3: true,
				values4: false,
				checked: 1,
				weekList: [{
					name: '礼品',
					id: '1'
				}, {
					name: '体验券',
					id: '2'
				}],
				weekSelect: [], //选中的
				noticeSelect: [], //选中的
				timeList: [{
						name: '即时发送',
						id: '1'
					},
					{
						name: '定时发送',
						id: '2'
					}
				],
				timeSelect: [], //选中的
				selectItemId: 0,
				selectId: 0,
				itemlist: {},
				show: false,
				value1: Number(new Date()),
				datatime: '',
				cardlist: [],
				list: {}
			}
		},
		onLoad(options) {
			this.list = options
			this.admin_index()
		},
		methods: {
			// 下架
			xiajia(item, index) {
				let that = this
				uni.showModal({
					title: '提示',
					// 提示文字
					content: '是否下架？',
					// 取消按钮的文字自定义
					cancelText: "我再想想",
					// 确认按钮的文字自定义
					confirmText: "下架",
					//删除字体的颜色 
					confirmColor: '#000000',
					//取消字体的颜色
					cancelColor: '#999',
					success: function(res) {
						if (res.confirm) {
							// 执行确认后的操作
							let postData = {
								goods_id: that.list.id,
								type: that.list.typelist,
								status: '0',
							}
							personal.up_and_down(postData).then(result => {
								if (result.code == 1) {
									uni.navigateBack({
										delta: 1, //返回层数，2则上上页
									})
								}
							})
						} else {

						}
					}
				})
			},
			// 上架
			shangjia(item, index) {
				let that = this
				uni.showModal({
					title: '提示',
					// 提示文字
					content: '是否通过？',
					// 取消按钮的文字自定义
					cancelText: "我再想想",
					// 确认按钮的文字自定义
					confirmText: "上架",
					//删除字体的颜色 
					confirmColor: '#000000',
					//取消字体的颜色
					cancelColor: '#999',
					success: function(res) {
						if (res.confirm) {
							// 执行确认后的操作
							let postData = {
								goods_id: that.list.id,
								type: that.list.typelist,
								status: '1',
							}
							personal.up_and_down(postData).then(result => {
								if (result.code == 1) {
									uni.navigateBack({
										delta: 1, //返回层数，2则上上页
									})
								}
							})
						} else {

						}
					}
				})
			},

			async admin_index(typelist) {
				let that = this
				let params = {
					goods_id: this.list.id,
					type: this.list.typelist
				};
				let res = await personal.detail(params);
				if (res.code == 1) {
					this.cardlist = res.data
				}
			},

			groupChange(n) {
			},
			radioChange(item, n) {
				this.checked = item.id
				this.itemlist = item
			},
			xzclick() {
				uni.navigateTo({
					url: '../member_profile/select_members'
				})
			},
			// 发送渠道
			handSelect(data) {
				if (this.weekSelect.includes(data)) {
					this.weekSelect = this.weekSelect.filter((item) => {
						return item !== data
					})
				} else {
					this.weekSelect.push(data)
				}
			},
			noticesSelect(item, index) {
				this.selectItemId = index
			},
			timesSelect(item, index) {
				this.selectId = index
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		width: 100%;
		height: 100vh;
		background-color: #dedede;

		.group_3 {
			background-color: rgba(255, 255, 255, 1.000000);
			width: 710rpx;
			height: 90vh;
			display: flex;
			flex-direction: column;
			margin: 20rpx 0 0 20rpx;

			.item {
				// padding: 29rpx 30rpx 30rpx;
				padding: 25rpx 30rpx 20rpx 30rpx;

				.item-title {
					color: rgb(153, 153, 153);
					font-size: 28rpx;
					font-weight: 500;
					margin-bottom: 20rpx;
				}

				.value {
					color: rgb(51, 51, 51);
					font-size: 28rpx;
					font-weight: 500;
				}

				.time-cell {
					color: rgb(51, 51, 51);
					font-size: 28rpx;
					font-weight: 500;
					justify-content: flex-start;

					.time {
						width: 49%;

						&:last-of-type {
							margin-left: 20rpx;
						}
					}
				}

				.week-list {
					display: grid;
					grid-template-columns: repeat(5, 1fr);
					grid-gap: 20rpx;
					position: relative;

					.week-item {
						padding: 15rpx 0;
						background-color: rgb(243, 243, 243);
						border-radius: 5rpx;
						text-align: center;
						color: rgb(51, 51, 51);
						font-size: 24rpx;
						font-weight: 500;
						border: solid 2rpx transparent;
						box-sizing: border-box;
					}

					.active {
						color: rgba(255, 98, 0, 1);
						background-color: rgba(255, 65, 5, 0.1);
						// border: solid 2rpx rgb(99, 93, 247);
						position: relative;

						// &:before {
						// 	display: block;
						// 	content: '';
						// 	position: absolute;
						// 	width: 27rpx;
						// 	height: 28rpx;
						// 	right: -2rpx;
						// 	bottom: -2rpx;
						// 	background-image: url("https://jiangsudiantuo2022.oss-cn-hangzhou.aliyuncs.com/img/46b1cc85fcb0fd76095daf823b7d2bb4a3235519.png");
						// 	background-repeat: no-repeat;
						// 	background-size: 100%;
						// }
					}

					.active1 {
						color: rgba(255, 98, 0, 1);
						background-color: rgba(255, 65, 5, 0.1);
						// border: solid 2rpx rgb(99, 93, 247);
						position: relative;
					}

					.active2 {
						color: rgba(255, 98, 0, 1);
						background-color: rgba(255, 65, 5, 0.1);
						// border: solid 2rpx rgb(99, 93, 247);
						position: relative;
					}

					.check {
						color: rgb(51, 51, 51);
						font-size: 24rpx;
						position: absolute;
						bottom: 10rpx;
						right: 0;
					}
				}
			}
		}

		.text_2 {
			width: 93rpx;
			height: 23rpx;
			overflow-wrap: break-word;
			color: rgba(136, 136, 136, 1);
			font-size: 24rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 15rpx 0 0 21rpx;
		}

		.section_1 {
			width: 100%;
			height: 70rpx;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
			margin: 28rpx 0 0rpx 20rpx;
			border-bottom: solid 2rpx #efefef;
		}

		.section_11 {
			width: 100%;
			height: 160rpx;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
			margin: 28rpx 0 0rpx 20rpx;
			border-bottom: solid 2rpx #efefef;
		}

		.section_12 {
			width: 100%;
			height: 100rpx;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
			margin: 28rpx 0 0rpx 20rpx;
			border-bottom: solid 2rpx #efefef;
		}

		.box_3 {
			height: 40rpx;
			background-size: 100% 100%;
			display: flex;
			flex-direction: row;
			// width: 150rpx;
		}

		.label_1 {
			width: 40rpx;
			height: 40rpx;
			border-radius: 50%;
		}

		.label_2 {
			width: 40rpx;
			height: 40rpx;
			margin-left: -6rpx;
			border-radius: 50%;
		}

		.label_3 {
			width: 40rpx;
			height: 40rpx;
			margin-left: -6rpx;
			border-radius: 50%;
		}

		.label_4 {
			width: 140rpx;
			height: 140rpx;
			margin-left: -6rpx;
			// border-radius: 50%;
		}

		.image-text_1 {
			width: 150rpx;
			height: 27rpx;
			margin-top: 6rpx;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
			margin-right: 40rpx;
		}

		.text-group_1 {
			width: 126rpx;
			height: 27rpx;
			overflow-wrap: break-word;
			color: rgba(40, 40, 40, 1);
			font-size: 28rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
		}

		.text-group_2 {
			width: 126rpx;
			height: 40rpx;
			overflow-wrap: break-word;
			color: rgba(40, 40, 40, 1);
			font-size: 28rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 40rpx;
			margin-top: 20rpx;
		}

		.icon_2 {
			width: 7rpx;
			height: 14rpx;
			margin-top: 13rpx;
		}

		.section_2 {
			background-color: rgba(229, 229, 229, 1.0);
			width: 672rpx;
			height: 1rpx;
			display: flex;
			flex-direction: column;
			margin: 40rpx 0 0 18rpx;
		}

		.text_3 {
			width: 47rpx;
			height: 23rpx;
			overflow-wrap: break-word;
			color: rgba(136, 136, 136, 1);
			font-size: 24rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 42rpx 0 0 19rpx;
		}

		.text_4 {
			width: 82rpx;
			height: 26rpx;
			overflow-wrap: break-word;
			color: rgba(51, 51, 51, 1);
			font-size: 28rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 24rpx 0 0 20rpx;
		}

		.section_3 {
			background-color: rgba(229, 229, 229, 1.0);
			width: 672rpx;
			height: 1rpx;
			display: flex;
			flex-direction: column;
			margin: 40rpx 0 0 18rpx;
		}

		.text_5 {
			width: 47rpx;
			height: 23rpx;
			overflow-wrap: break-word;
			color: rgba(136, 136, 136, 1);
			font-size: 24rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 39rpx 0 0 19rpx;
		}

		.text_6 {
			width: 82rpx;
			height: 26rpx;
			overflow-wrap: break-word;
			color: rgba(51, 51, 51, 1);
			font-size: 28rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 24rpx 0 0 20rpx;
		}

		.section_4 {
			background-color: rgba(229, 229, 229, 1.0);
			width: 672rpx;
			height: 1rpx;
			display: flex;
			flex-direction: column;
			margin: 40rpx 0 0 18rpx;
		}

		.text_7 {
			width: 95rpx;
			height: 23rpx;
			overflow-wrap: break-word;
			color: rgba(136, 136, 136, 1);
			font-size: 24rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 39rpx 0 0 19rpx;
		}

		.image_2 {
			width: 151rpx;
			height: 151rpx;
			margin: 25rpx 0 0 18rpx;
		}


		.text_8 {
			width: 95rpx;
			height: 23rpx;
			overflow-wrap: break-word;
			color: rgba(136, 136, 136, 1);
			font-size: 24rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 20rpx 0 0 19rpx;
		}

		.section_6 {
			width: 378rpx;
			height: 62rpx;
			flex-direction: row;
			display: flex;
			justify-content: space-between;
			margin: 26rpx 0 27rpx 21rpx;
		}

		.button_1 {
			background-color: rgba(243, 243, 243, 1.0);
			height: 62rpx;
			display: flex;
			flex-direction: column;
			width: 174rpx;
		}

		.text_9 {
			width: 48rpx;
			height: 24rpx;
			overflow-wrap: break-word;
			color: rgba(51, 51, 51, 1);
			font-size: 24rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 19rpx 0 0 63rpx;
		}

		.button_2 {
			background-color: rgba(255, 65, 5, 0.1);
			height: 62rpx;
			display: flex;
			flex-direction: column;
			width: 174rpx;
		}

		.text_10 {
			width: 73rpx;
			height: 24rpx;
			overflow-wrap: break-word;
			color: rgba(255, 98, 0, 1);
			font-size: 24rpx;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			text-align: left;
			white-space: nowrap;
			line-height: 34rpx;
			margin: 19rpx 0 0 51rpx;
		}

		.button_3 {
			width: 40%;
			height: 80rpx;
			// position: absolute;
			// bottom: 20rpx;
			margin-top: 20rpx;
			border: 1rpx rgba(214, 53, 53, 0.9) solid;
			// background: linear-gradient(0deg, rgba(214, 53, 53, 0.9), rgba(255, 64, 64, 0.93), rgba(250, 142, 142, 0.93));
			background-color: #fff;
			border-radius: 80rpx 80rpx;
			margin-left: 5%;
			color: rgba(214, 53, 53, 0.9);
			font-size: 28rpx;
			font-family: PingFang-SC-Medium;
			line-height: 80rpx;
		}

		.button_4 {
			width: 40%;
			height: 80rpx;
			// position: absolute;
			// bottom: 20rpx;
			margin-top: 20rpx;
			background: linear-gradient(0deg, rgba(214, 53, 53, 0.9), rgba(255, 64, 64, 0.93), rgba(250, 142, 142, 0.93));
			border-radius: 80rpx 80rpx;
			margin-left: 5%;
			color: rgba(255, 255, 255, 1);
			font-size: 28rpx;
			font-family: PingFang-SC-Medium;
			line-height: 80rpx;
		}

		.button_5 {
			width: 90%;
			height: 80rpx;
			// position: absolute;
			// bottom: 20rpx;
			margin-top: 20rpx;
			background: linear-gradient(0deg, rgba(214, 53, 53, 0.9), rgba(255, 64, 64, 0.93), rgba(250, 142, 142, 0.93));
			border-radius: 80rpx 80rpx;
			margin-left: 5%;
			color: rgba(255, 255, 255, 1);
			font-size: 28rpx;
			font-family: PingFang-SC-Medium;
			line-height: 80rpx;
		}
	}
</style>